<template>
  <div class="add_production_box">
    <el-dialog
      @close="handleClose(false)"
      @open="handleOpen"
      close-on-press-escape
      v-dialogDrag
      :title="'分配设备'"
      :close-on-click-modal="false"
      :lock-scroll="false"
      :visible="showDialog"
      width="40%"
    >
      <el-form
        :model="form"
        ref="form"
        label-width="80px"
        :inline="false"
        size="normal"
      >
        <el-form-item label="选择设备">
          <el-cascader
            class="w100"
            :props="defaultProps"
            v-model="val"
            clearable
            :options="devList(form.deviceInfoList)"
            size="small"
          ></el-cascader>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="handleClose(false)">取 消</el-button>
        <el-button
          :loading="btnLoading"
          size="mini"
          type="primary"
          @click="submitForm('form')"
          >确 定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { putFormula } from "@/api/combinedFurnace";

import { getDeviceGroupLists } from "@/api/deviceGroup";
export default {
  computed: {
    devList() {
      return function(list = []) {
        let treeList = [];
        treeList = list.map(item => {
          return {
            ...item,
            deviceName: item.deviceTypeName,
            deviceToken: item.deviceTypeToken
          };
        });

        // treeList.push({
        //   deviceTypeToken: "DJ",
        //   deviceTypeName: "锻机",
        //   deviceName: "锻机",
        //   deviceToken: "DJ",
        //   deviceList: this.deviceGroupLists.map((item) => {
        //     return {
        //       deviceToken: item.token,
        //       deviceName: item.name,
        //       toolingName: "",
        //       toolingCount: "",
        //       partCount: "",
        //       feedCount: "",
        //       tailCount: "",
        //       description: "",
        //     };
        //   }),
        // });
        console.log("treeList :>> ", treeList);
        return treeList;
      };
    }
  },
  props: {
    form: {
      type: Object,
      default: () => {}
    },
    showDialog: {
      type: Boolean,
      default: false
    }
  },

  data() {
    return {
      btnLoading: false,
      defaultProps: {
        value: "deviceToken",
        label: "deviceName",
        children: "deviceList"
      },
      isSetDev: false,
      val: []
      // deviceGroupLists: [],
    };
  },
  async created() {
    // const res = await getDeviceGroupLists();
    // console.log("res :>> ", res);
    // const { results } = res.data;
    // this.deviceGroupLists = results;
  },
  methods: {
    //弹窗打开执行操作
    handleOpen() {
      this.val = [];
      if (this.form.deviceInfo.deviceToken) {
        let typeToken = "";
        for (let item of this.form.deviceInfoList) {
          for (let param of item.deviceList) {
            if (param.deviceToken === this.form.deviceInfo.deviceToken) {
              typeToken = item.deviceTypeToken;
            }
          }
        }

        this.val.push(typeToken, this.form.deviceInfo.deviceToken);
      }
    },
    submitForm(formName) {
      // if (!this.val.length) {
      //   this.$msg("请选择设备");
      //   return;
      // }
      console.log("this.val", this.val);
      if (this.val.length && this.val[0] == "") {
        this.$msg("暂无设备");
        return;
      }
      if (this.val.length) {
        let deviceAssignment = this.devList(this.form.deviceInfoList).find(
          f => f.deviceTypeToken === this.val[0]
        );

        let deviceInfo = deviceAssignment.deviceList.find(
          f => f.deviceToken === this.val[1]
        );
        console.log(deviceInfo);
        // deviceAssignment.deviceList = deviceAssignment.deviceList.filter(
        //   (f) => f.deviceToken == this.val[1]
        // );
        // delete deviceAssignment.deviceName;
        // delete deviceAssignment.deviceToken;
        // this.form.deviceAssignment = deviceAssignment;
        this.form.deviceInfo = { ...deviceInfo };
      } else {
        this.form.deviceInfo = {
          deviceName: "",
          deviceToken: ""
        };
      }

      this.btnLoading = true;
      putFormula(
        {
          ...this.form,
          state: this.form.state === "初始" ? "初始" : this.form.state,
          deviceTaskNumber: `${this.$moment().format("YYYYMMDD")}-${
            this.form.deviceInfo.deviceToken
          }-${Date.now()}`
        },
        this.form.token
      )
        .then(res => {
          if (this.form.state === "分炉") {
            this.handleClose(this.form.deviceInfo);
          } else {
            this.handleClose(true);
          }
          this.val = [];
        })
        .finally(f => {
          this.btnLoading = false;
        });
      console.log(" this.form :>> ", this.form);
    },
    // 弹窗关闭执行操作
    handleClose(isRefresh) {
      this.$emit("update:showDialog", false);
      this.$emit("closeDialog", isRefresh);
    }
  }
};
</script>

<style lang="scss" scoped></style>
